<!DOCTYPE html>
<html class="x-admin-sm">
<head>
    <meta charset="UTF-8">
    <title>欢迎页面-气清</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <script type="text/javascript" src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="./js/xadmin.js"></script>
    <script type="text/javascript" src="./js/cookie.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
    <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
    <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
    <script type="text/javascript" src="./js/vue.min.js"></script>
    <style> [v-cloak] {
        display: none;
    } </style>
</head>
<body>
<div class="x-body">
    <blockquote class="layui-elem-quote" id="welcome">



    </blockquote>
    <fieldset class="layui-elem-field">
        <legend>数据统计</legend>
        <div class="layui-field-box">
            <div class="layui-col-md12">
                <div class="layui-card">
                    <div class="layui-card-body">
                        <div class="layui-carousel x-admin-carousel x-admin-backlog" lay-anim="" lay-indicator="inside"
                             lay-arrow="none" style="width: 100%; height: 90px;">
                            <div carousel-item="" id="AllNum" v-if="Num != null">
                                <ul class="layui-row layui-col-space10 layui-this" id="welcome1">
                                    <li class="layui-col-xs2">
                                        <a href="javascript:;" class="x-admin-backlog-body">
                                            <h3>商品总类</h3>
                                            <p>
                                                <cite>{{Num.itemsNum}}</cite></p>
                                        </a>
                                    </li>
                                    <li class="layui-col-xs2">
                                        <a href="javascript:;" class="x-admin-backlog-body">
                                            <h3>未发货订单</h3>
                                            <p>
                                                <cite>{{Num.orderNum}}</cite></p>
                                        </a>
                                    </li>
                                    <li class="layui-col-xs2">
                                        <a href="javascript:;" class="x-admin-backlog-body">
                                            <h3>正在租用</h3>
                                            <p>
                                                <cite>{{Num.itemNum}}</cite></p>
                                        </a>
                                    </li>

                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </fieldset>
</div>
<script>
    layui.use(['layer', 'jquery', 'table', 'form'], function () {
        $ = layui.jquery;
        var table = layui.table;
        var form = layui.form;

        //这里要获取当前的用户名 还有时间
        //显示出现在有多少的商品 订单（派送中 出租中） 订单的状态 1 用户刚下单 正在配送中 2 配送到 后开始收费  3 用户点击 租用结束 订单算完成 4 商品回收

        $.ajax({
            url: '/welcome/findAdminName',
            dataType: 'json',
            type: 'post',
            success: function (data) {
                // console.log(data.data);
                var name=data.data.name;
                $('#welcome').append('<li>' +'欢迎管理员：'+ name+'</li>');
            }
        })
    })

    //创建一个vue
    var vm = new Vue({
        el: '#AllNum',
        data: {
            Num: null,
        },
    });
    $.ajax({
        type:"post",
        url:"/index/show",
        success:function (result) {
            console.log(result.data)
           vm.Num = result.data;
        }
    })
</script>
</body>
</html>